<template>
	<view style="padding: 0px 15px 15px 15px;">
		<view class="">
			<view style="line-height: 40px;"><uni-tag text="我的反馈" :mark="true" type="error"
					style="color: white;letter-spacing: 2px;font-weight: bold;"></uni-tag>
				<span style="color:#999;float: right;"
					v-if="userDataInfo.CreateTime">{{userDataInfo.CreateTime.substring(0,19)}}</span>
			</view>
			<uni-section title="反馈内容" type="line" v-if="userDataInfo.ContentInfo">
				<view style="text-indent: 2rem;">
					{{userDataInfo.ContentInfo}}
				</view>
			</uni-section>
			<uni-section title="反馈图片" type="line" v-if="imgList.length">
				<uni-file-picker v-model="imgList" fileMediatype="image" mode="grid" readonly />
			</uni-section>
			<uni-section title="反馈视频" type="line" v-if="videoList.length">
				<view class="">
					<video v-for="item in videoList" :key="item.Id" :src="item.FileWebURL"
						style="width: 100%;margin-bottom: 10px;"></video>
				</view>
			</uni-section>
		</view>
		<view class="">
			<view style="line-height: 40px;"><uni-tag text="客服回复" :mark="true" type="error"
					style="color: white;letter-spacing: 2px;font-weight: bold;"></uni-tag>
				<span style="color:#999;float: right;"
					v-if="adminInfo.CreateTime">{{adminInfo.CreateTime.substring(0,19)}}</span>
			</view>
			<uni-section title="回复内容" type="line">
				<view v-if="adminInfo.ContentInfo" style="text-indent: 2rem">
					{{adminInfo.ContentInfo}}
				</view>
				<view v-else style="text-indent: 2rem">
					暂无回复
				</view>
			</uni-section>
			<uni-section title="回复图片" type="line" v-if="adminImgList.length">
				<uni-file-picker v-model="adminImgList" fileMediatype="image" mode="grid" readonly />
			</uni-section>
			<uni-section title="回复视频" type="line" v-if="adminVideoList.length">
				<view class="">
					<video v-for="item in adminVideoList" :key="item.Id" :src="item.FileWebURL"
						style="width: 100%;margin-bottom: 10px;"></video>
				</view>
			</uni-section>
		</view>
		<view class="" style="height: 50px;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Id: "",
				value: ['1', '2'],
				userDataInfo: {},
				adminInfo: {},
				imgList: [],
				videoList: [],
				adminImgList: [],
				adminVideoList: [],
			}
		},
		onLoad(item) {
			this.Id = item.Id
			this.getDataInfo()
		},
		methods: {
			getDataInfo() {
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				this.$http('Base_Manage/Base_VIPUserFeedBack/GetTheDataForView', {
					Id: this.Id
				}).then(res => {
					if (res.Success) {
						this.userDataInfo = res.Data || {}
						if (res.Data.FeedBack_FAL_List) {
							res.Data.FeedBack_FAL_List.forEach(item => {
								if (item.FileType == 'image') {
									this.$set(item, 'name', item.FileName)
									this.$set(item, 'extname', item.FileName)
									this.$set(item, 'url', item.FileWebURL)
									this.imgList.push(item)
								}
								if (item.FileType == 'video') {
									this.videoList.push(item)
								}
							})
						}
						this.adminInfo = res.Data.FeedBack_Replys[0] || {}
						if (this.adminInfo.FeedBack_FAL_List && this.adminInfo.FeedBack_FAL_List.length > 0) {
							this.adminInfo.FeedBack_FAL_List.forEach(item => {
								if (item.FileType == 'image') {
									this.$set(item, 'name', item.FileName)
									this.$set(item, 'extname', item.FileName)
									this.$set(item, 'url', item.FileWebURL)
									this.adminImgList.push(item)
								}
								if (item.FileType == 'video') {
									this.adminVideoList.push(item)
								}
							})
						}
					}
					uni.hideLoading()
				}).catch(err => {
					uni.hideLoading()
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .uni-section-header__decoration {
		background-color: #e64340 !important;
	}

	/deep/ .uni-section-content {
		padding-left: 10px !important;
	}

	/deep/ .uni-section-header {
		font-weight: bold !important;
		padding: 0px !important;
	}
</style>